.wrapBox {
  display: flex;
  height: 100%;
  width: 100%;
  padding: 1px 10px;
  align-items: center;
  justify-content: space-between;

  .logoContainer {
    height: 100%;
    display: flex;
    align-items: center;
    cursor: pointer;

    .logo{
      height: 100%;
      display: flex;
      align-items: center;
    }
  }

  .functionalZone {
    display: inline-flex;
    //flex-direction: row-reverse; // flex右排
    gap: 10px; // 子元素之间的宽度
    height: 100%;
    align-items: center;
    margin: 0 10px;

    .userInfo{
      height: 100%;
      margin: 0 10px;
      display: flex;
      align-items: center;
    }

    .avtar{
      height: 100%;
      cursor: pointer;
      display: flex;
      align-items: center;
    }

    .logoutContainer{
      height: 100%;
      display: flex;
      align-items: center;

    }
  }
}

